<template>
  <el-dialog :visible='visible' @close='cancel' :title="$t('developer.check_assist_result_list')" width='60%'>
    <el-card
       
      shadow="never"
      :body-style="{ padding: '0px' }"
      @current-change="currentChangeHandle"
      :page-size="pageSize"
      :total="totalPage"
      :current-page="pageIndex"
    >
      <el-table
        :show-overflow-tooltip="true"
        v-loading="listLoading"
        :data="tableData"
      >
        <el-table-column
          :label="$t('developer.check_assist_request_name')"
          prop="requestUsername"
          align="center"
          min-width="50px"
        />
        <el-table-column
          :label="$t('developer.check_assist_assist_name')"
          prop="assistUsername"
          align="center"
          min-width="50px"
        />
        <el-table-column
          :label="$t('developer.assist_result')"
          prop="assistResult"
          align="center"
          min-width="50px"
        >
          <template v-slot="scope">
            <el-tag type="info" size="small" v-if="scope.row.assistResult === 0" > {{ $t('developer.assist_result_type.unable_to_process') }} </el-tag>
            <el-tag type="success" size="small" v-if="scope.row.assistResult === 1" > {{ $t('developer.assist_result_type.approved') }} </el-tag>
            <el-tag type="danger" size="small" v-if="scope.row.assistResult === 2" > {{ $t('developer.assist_result_type.reject') }} </el-tag>
          </template>
        </el-table-column>
        <el-table-column
          :label="$t('developer.assist_result_explain')"
          style="word-break: break-word"
          prop="assistResultExplain"
          align="center"
          min-width="150px"
        />
      </el-table>
    </el-card>
  </el-dialog>
</template>

<script>
import { formatDate } from '@/utils/formatDate'
import { queryCheckAssistResult } from '@/api'

export default {
  data() {
    return {
      visible: false,
      developerId: '',
      confirmLoading: false,
      pageIndex: 1,
      pageSize: 10,
      totalPage: 0,
      tableData: [],
      listLoading: false
    }
  },
  created() {

  },
  mounted() {

  },
  methods: {
    init(developerId) {
      this.developerId = developerId
      this.visible = true
      const userInfo = JSON.parse(
        localStorage.getItem(this.$store.getters.keys.storage.username)
      )
      this.loginUserName = userInfo.username
      this.fetchData()
    },
    cancel() {
      this.visible = false
      this.$emit('close')
    },
    sizeChangeHandle(val) {
      this.pageSize = val
      this.fetchData()
    },
    currentChangeHandle(val) {
      this.pageIndex = val
      this.fetchData()
    },
    formatDate(cellValue, fmt) {
      cellValue = new Date(cellValue).valueOf()
      return formatDate(cellValue, fmt)
    },
    fetchData() {
      this.listLoading = true
      queryCheckAssistResult({
        pageNo: this.pageIndex,
        pageSize: this.pageSize,
        developerId: this.developerId
      })
        .then((res) => {
          this.listLoading = false
          this.tableData = res.data
          this.totalPage = res.rows
        })
        .catch((e) => {
          this.listLoading = false
        })
    }
  }
}
</script>
